.slot-item {
    -fx-item-width: 28.75;
    -fx-item-label-height: 32;
    -fx-cursor: hand;
    -fx-accent-color: #52c41a;
    -fx-primary-color: #333333;
}

.slot-item>.label {
    -fx-font-size: 16;
    -fx-background-color: -fx-accent-color;
    -fx-text-fill: white;
    -fx-max-width: -fx-item-width;
    -fx-pref-width: -fx-item-width;
    -fx-max-height: -fx-item-label-height;
    -fx-pref-height: -fx-item-label-height;
    -fx-alignment: center;
}

.slot-item>.radio-button {
    -fx-rotate: 90;
    -fx-alignment: center;
    -fx-max-width: -fx-item-width;
    -fx-pref-width: -fx-item-width;
}


/*******************************************************************************
 *                                                                             *
 * Radio Button                                                                *
 *                                                                             *
 ******************************************************************************/


/* hover */
.slot-item > .radio-button:hover > .radio {
    -fx-background-color: white;
    -fx-border-color: #333333, transparent;
}

.slot-item > .radio-button:selected:hover > .radio > .dot {
    -fx-background-color: #111;
}

/* selected */
.slot-item > .radio-button:selected > .radio {
    -fx-border-color: -fx-accent-color, transparent;
}

.slot-item > .radio-button:selected > .radio > .dot {
    -fx-background-color: -fx-accent-color;
}

.slot-item > .radio-button:selected:hover > .radio > .dot {
    -fx-background-color: -fx-accent-color;
}

